/* Jake Ruiz Graphic Design. Manila, Philippines. Coding and CSS by bakesix aka Jake Ruiz. Version 3.0.  */

.content {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 321px) {

	.nav a {
		font: .85em 'muller_narrowlight';
		letter-spacing:2px;
	}

}


@media screen and (max-width: 550px) {

body, html {
	margin-right:0;
}

.container {
	height:85vh;
}
	
/* Header */

.header {
	padding-top:5%;
	padding-left:5%;
	padding-right:5%;
	background-color:#FFF;
	height:7.5%;
	position:fixed;
	z-index:20;
}

	.logo {
		height:30px;
		width:25%;
	}
	
		.logo img {
			height:30px;
		}
			
	.navframe {
		height:60px;
		width:75%;
	}	
	
	.nav {
		margin-top:0px;	
	}
	
		.nav ul {
			line-height:25px;	
		}
		
	.nav ul li { /*Parent link clicked*/
		padding-top: 7.5px;
	}
	
/* Content */

.content {
	height:85%;
	width:100%;
	padding-left:0;
	padding-right:0;
	margin-top:7.5%;
}

.text {
	width:45%;
	margin-left:5%;
}


	.text h1 {
		font: 4.75em 'loveloline_light';
		line-height:95px;
		letter-spacing:15px;
		padding-bottom:0;
	}
	
	.text h2 {
		font:1.5em 'muller_narrowlight_italic';
		line-height:0px;
		margin-bottom:0;
		margin-top:100px;	
	}
	
	.text p {
		margin-left:0%;
		font: 1em 'muller_narrowlight';
	}


.photo {
	width:50%;
	background-size:275%;
	background-position:55% 30%;
}

/* Footer */
.footer {
	padding-left:7.5%;
	background-color:#FFF;
	position:relative;
	z-index:5;
}

.footercontent {
	height:70px;
}

	.footer ul {
		bottom: 10px;
	}

	.footer li {
		font: .75em 'muller_narrowlight';
	}

	
}



@media screen and (min-width: 700px) {
	
	.text h1 {
		font:8em 'loveloline_light';
		line-height:125px;
		padding-bottom:0;
	}
	
	.text h2 {
		font:1.5em 'muller_narrowlight_italic';
		line-height:0px;
		margin-bottom:0;
		margin-top:20%;	
	}	

}



@media screen and (min-width: 850px) {

.container {
	width: 850px;
    margin-left: auto;
    margin-right: auto;
}

.photo {	
	background-size:150%;
}

	.text h1 {
		font:8.5em 'loveloline_light';
		line-height:150px;
		padding-bottom:0;
		letter-spacing:45px;
	}
	
	.text h2 {
		margin-top:10%;	
	}	

}

@media screen and (max-height: 450px) {

.container {
	height:700px;
}

.header {
	background-color:#FFF;
	height:80px;
}

	.navframe {
		width:20%;

}

.content {
	/*background-color:#FC6;*/
	height:500px;

}

	.text h1 {
		font:5.5em 'loveloline_light';
	}
	
	.text h2 {
		font:1.5em 'muller_narrowlight_italic';
		line-height:0px;
		margin-bottom:0;	
	}
	
.photo {	
	background-size:175%;
	background-position:65% 40%;
}

	.footer li {
		font: .75em 'muller_narrowlight';
	}